import { FC, Component } from 'react'
import { RouteComponentProps  } from 'react-router-dom'

interface IProps {} // 想让props中，有history/match/location
interface IState {
  title: string
}

// 前提：凡是能找到注解文件的第三方插件，都可以找到相关的整体注解的接口
// 注解 路由，通过路由的注解，给组件的props注入相关的ts注解;
export type RouterPropsItem = RouteComponentProps<IProps>

class BlankLayout extends Component<RouterPropsItem, IState> {
  constructor(props:RouterPropsItem) {
    super(props) // super干了什么？调用执行父类
    this.state = {
      title: '我是布局首页'
    }
  }
  render() {
    console.log(this.props, 'props')
    const { children, history, location, match } = this.props;
    // history.push()
    const { title } = this.state;
    return <div>
      <h1>测试标题</h1>
      {children}
    </div>
  }
}

export default BlankLayout;

// 修饰器，
// 修饰函数 ： 在构造函数外面，定义一个修饰函数。可以通过修饰器语法，
// function auto(constructor: any) {}
// @auto
// class Foo {}

// interface BlankLayoutProps {
//   title: string
// }

// export const BlankLayout:FC<BlankLayoutProps> = (props) => {
//   const { title } = props;

//    return <div>
//       <h1>{title}</h1>
//       {props.children}
//    </div>
// }

// BlankLayout.defaultProps = {
//   title: '空白布局'
// }


// export default BlankLayout;
